*{
    padding: 0;
    margin: 0;
    list-style: none;
   
} 
 $appwidth:375;
html,body{
     box-sizing: border-box; 
    width: $appwidth+px;
// border: 1px solid black;
height: 100%;

}

#app{
    width: 100%;
    // border: 1px solid red;
    height: 100%;
}

@function pxtovw($p){
    @return (100/$appwidth*$p) * 1vw;
}



//footTabBar组件
.tab{
    z-index: 2;
    background-color:white; 
    width:100%;
    height:pxtovw(50);
    // border:1px solid salmon;
    bottom: 0px;
    position: fixed;
    color: #A0A0A0;
    box-shadow: 0 0 pxtovw(5) #ccc;
    .tabul{
        display: flex;
        justify-content: space-around;
        align-items: center;
        height:pxtovw(50);

        .tabli{

          text-align: center;
          font-size:pxtovw(12);
          p{
              i{
                   font-size:pxtovw(14);

              }
          }
          .active{
                color: orange;
            }
        }
        
           
    }
    
    
}





//headerSeach组件
.seach{
    width: 100%;
    z-index: 2;
    height: pxtovw(40);
    position: fixed;
    background: #F2F2F2;
    display: flex;
    justify-content: space-around;
    align-items: center;
    .icon-xiaomi{
        color: orange;
        width: pxtovw(30);
        font-size: pxtovw(16);
    

    }
    input{
        outline: none;
        border: none;
        height: pxtovw(25);
      width: pxtovw(245);
      font-size: pxtovw(12);
      padding-left: pxtovw(30);
      
    }
    .icon-sousuo{
        font-size: pxtovw(12);
        position: absolute;
        left:pxtovw(75) ;
    }
    
    .icon-smiling{
        font-size: pxtovw(16);
    }
}